
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>用户列表</title>
<link rel="stylesheet" type="text/css" media="screen"
	href="../static/css/bootstrap.min.css">
</head>
<body>

	<div class="container">
		<ol class="breadcrumb">
			<li><a href="#">用户管理</a></li>
			<li class="active">用户修改</li>
			<li style="float: right"><a href="${base}/loginOut">退出</a>&nbsp;&nbsp;&nbsp;&nbsp;</li>
		</ol>

		<!-- 主体内容开始 -->
			<!-- 表单开始 -->

<!--			<form action=""-->
<!--				class="form-horizontal" id="commForm">-->
				<!-- 待编辑区 panel开始 -->
				<div class="panel panel-info">
					<div class="panel-heading">
						<i class="fa fa-pencil"></i>&nbsp;&nbsp;修改
					</div>
					<!-- panel-body开始 -->
					<div class="panel-body">
						<input type="hidden" id="ipt-userId" name="id" />
						<div class="form-group">
							<label for="taskName" class="col-sm-3 control-label">用户名称</label>
							<div class="col-sm-5">

								<input type="text" class="form-control" id="userName"
									name="userName" placeholder="用户名称" >
							</div>
						</div>

						<div class="form-group">
							<label for="password" class="col-sm-3 control-label">用户密码</label>
							<div class="col-sm-5">
								<input type="password" class="form-control" id="password"
									name="password" placeholder="用户密码" >
							</div>
						</div>


					</div>
					<!-- panel-body结束 -->
					<!-- panel-footer开始 -->
					<div class="panel-footer text-right">
						<button type="button" name="returnBtn" class="btn btn-default"
							id="returnBtn"
							onclick="location.href='users.html'">返回</button>
						<button type="reset" name="resetBtn" id="resetBtn"
							class="btn btn-warning">重置</button>
						<button  name="submitBtn" class="btn btn-primary"
							id="submitBtn">提交</button>
					</div>
					<!-- panel-footer结束 -->
				</div>
				<!-- 待编辑区panel结束 -->
<!--			</form>-->
			<!--表单结束 -->
		</div>
</body>
</html>
<script src="../static/js/axios.min.js"></script>
<script>
	function getQueryParam(name) {
		const queryString = window.location.search;
		const params = new URLSearchParams(queryString);
		return params.get(name);
	}

	window.onload = function (){
		const id = getQueryParam('id');
		const url = `/user/${id}`
		axios.get( url )
				.then(function (res) {
					const R = res.data

					if (R.code === 201){
						alert(R.msg)
						return
					}

					const user = R.data
					document.getElementById("ipt-userId").value = user.id
					document.getElementById("userName").value = user.username
					document.getElementById("password").value = user.password
				})
	}

	document.getElementById("submitBtn")
			.onclick = function () {

		const id = document.getElementById("ipt-userId").value
		const username = document.getElementById("userName").value
		const pwd = document.getElementById("password").value

		const url = '/user'
		const data = {
			'id' : id,
			'username' : username,
			'password' : pwd
		}
		axios.put(url , data)
				.then(res => {
					const R = res.data

					if (R.code === 200){

						alert('修改成功')
						location.href = "/users/users.html"
					}
				});

	}

</script>